<template>

<div>
    活动名称
    <el-input v-model="server.name"></el-input>
    活动地点
     <el-input v-model="server.address"></el-input>
    活动内容
    <el-input v-model="server.content"></el-input>
    
     
  <!-- 选择小区 -->
  <el-dropdown @command="handleCommand1">   
  <span class="el-dropdown-link">
    请选择活动小区<i class="el-icon-arrow-down el-icon--right"></i>
  </span>
  <el-dropdown-menu slot="dropdown">
    <el-dropdown-item command="1">蜗牛小区1</el-dropdown-item>
    <el-dropdown-item command="2">蜗牛小区2</el-dropdown-item>
  </el-dropdown-menu>
</el-dropdown>
服务小区为：<el-tag type="success">{{cid}}</el-tag>

<!-- 上传图片 -->
<el-form>
  <!-- 上传时间 -->
  <el-form-item label="活动时间">
        <el-date-picker v-model="server.time"
                        type="datetime"
                        placeholder="选择日期时间">
        </el-date-picker>
      </el-form-item>
      <!-- 上传图片 -->
 <el-form-item label="上传图片">
        <el-upload class="avatar-uploader"
                   action="http://192.168.11.18:8080/file/uploadImage"
                   :show-file-list="false"
                   :on-success="getUploadFileName">
          <img v-if="imageUrl"
               :src="imageUrl"
               class="avatar">
          <i v-else
             class="el-icon-upload avatar-uploader-icon"></i>
        </el-upload>
      </el-form-item>
</el-form>



  <div id="action">
    <el-button type="danger" size="mini" @click="commit">确定</el-button>
      <el-button type="success" size="mini" @click="cancel">取消</el-button>   
    </div> 
  </div>
 
</template>

<script>

export default {
data(){
return{
 cid:'',
  imageUrl: '',
}
},
methods:{ 
  // 上传图片
  getUploadFileName (res) {
      this.imageUrl = res;
      this.server.image = res;
      console.log(res)
    },
  // 选择小区方法
handleCommand1(command) {
this.server.cid=command
 if (command==1) {
   this.cid="蜗牛小区1"
 }
 if (command==2) {
   this.cid="蜗牛小区2"
 }
      },
     cancel(){
 this.$emit("add_dialog",{result:true,data:{}})
    },
    commit(){
       //格式化时间格式
      let seperator1 = "-";
      let seperator2 = ":";
      let month = this.server.time.getMonth() + 1;
      let strDate = this.server.time.getDate();
      let hours = this.server.time.getHours();
      let minutes = this.server.time.getMinutes();
      let seconds = this.server.time.getSeconds();
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
      }
      if (hours >= 0 && hours <= 9) {
        hours = "0" + hours;
      }
      if (minutes >= 0 && minutes <= 9) {
        minutes = "0" + minutes;
      }
      if (seconds >= 0 && seconds <= 9) {
        seconds = "0" + seconds;
      }

      let formatTime = this.server.time.getFullYear() + seperator1 + month + seperator1 + strDate
        + " " + hours + seperator2 + minutes + seperator2 + seconds;

      //修改时间
      this.server.time = formatTime;
      this.$emit("add_dialog",{result:true,data:this.server})
    } 
},

props:{
    server:{
      time: new Date(2021, 0, 1, 9, 0),   //活动时间
    }//用来接收父组件传过来的数据
}


}
</script>

<style scoped>

</style>